<#include "header.html">
<div class="container">
    <div class="section">






        <div class="row">
            <div class="col s12 l9">





                <div class="row">
                    <div class="col s12 m12">
                        <div class="card hoverable">

                            <div class="card-action">
                                <a>正在关注</a>

                            </div>

                            <ul class="collection">
                                <#list followees as vo>
                                    <li class="collection-item avatar">
                                        <a href="/user/${vo.user.id}"><img src="${vo.user.headUrl}" alt="" class="circle"></a>
                                        <a href="/user/${vo.user.id}"><span class="title">${vo.user.name}</span></a>
                                        <p>${vo.followeeCount} 正在关注 / ${vo.followerCount} 个关注者
                                        </p>
                                        <#if user?? && user.id == curUser.id>
                                            <a id="unfollow-btn-${vo.user.id}" href="javascript:$.post('/unfollow/user',{userId:${vo.user.id}}, function(data){console.log(data);$('#unfollow-btn-${vo.user.id}').hide();$('#follow-btn-${vo.user.id}').show();});" class="waves-effect waves-light btn secondary-content"><span >取消关注</span></a>
                                            <a style="display:none" id="follow-btn-${vo.user.id}" href="javascript:$.post('/follow/user',{userId:${vo.user.id}}, function(data){console.log(data);$('#follow-btn-${vo.user.id}').hide();$('#unfollow-btn-${vo.user.id}').show();});" class="waves-effect waves-light btn secondary-content"><span >关注</span></a>
                                        </#if>
                                    </li>
                                </#list>

                            </ul>




                            <div class="card-content">
                                <!-- 分页 -->
                                <ul class="pagination center">
                                    <#if prePId??>
                                    <li class="waves-effect"><a href="/followees/${curUser.id}?pId=${prePId}"><i class="material-icons">chevron_left</i></a></li>
                                </#if>

                                <#if nextPId??>
                                <li class="waves-effect"><a href="/followees/${curUser.id}?pId=${nextPId}"><i class="material-icons">chevron_right</i></a></li>
                            </#if>
                                </ul>

                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

    </div>

</div>


<#include "footer.html">